<template>
  <div class="config_container" v-if="dialogVisible">
    <div class="setting_btn" v-if="btnShow">
      <span class="el-icon-setting setting_ico" @click="handleOpen"></span>
    </div>
    <el-dialog
      class="config_setting_dialog"
      title="用户自定义预约记录"
      :visible.sync="dialogVisible"
      top="50px"
      width="80%"
      append-to-body
      :close-on-click-modal="true"
      :before-close="handleClose"
      :destroy-on-close="true"
    >
      <AppointmentListForm v-if="dialogVisible" ref="AppointmentListForm" :dialog-visible-parent="dialogVisible"/>
      <span slot="footer" class="dialog-footer">
        <el-button size="small" @click="dialogVisible = false">取消</el-button>
        <el-button size="small" type="primary" @click="settingSend">保存</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
/* eslint-disable */
import { postSetuserparamtersettings} from '@/api/api'
import Sortable from 'sortablejs'
import AppointmentListForm from '@/components/appConfig/check/appointmentList'
import { Options } from '@/utils/constant'
export default {
  props: {
    btnShow: {
      type: Boolean,
      default: true
    },
    configVisible: {
      type: Boolean,
      default: false
    },
    hospitalCode: {
      type: String,
      default: ''
    },
    configType: {
      // user 为个人配置
      type: String,
      default: ''
    }
  },
  components: {
    AppointmentListForm
  },
  data() {
    return {
      dialogVisible: false,
      userParameterContent: {}
    }
  },
  computed: {
    paramConfig() {
      return this.$store.state.settings.paramConfig
    }
  },
  mounted() {
  },
  methods: {
    handleOpen() {
      this.dialogVisible = true
    },
    handleClose() {
      this.dialogVisible = false
    },
    // 配置保存
    async settingSend() {
      let userParamsConfig = JSON.parse(this.paramConfig.userParameterContent) || {}
      userParamsConfig.bookTable = this.$refs.AppointmentListForm.tabledataColumnsConfig
      const params = {
        hospitalCode: this.$store.state.user.hospitalCode,
        userId: this.$store.state.user.id,
        parameterContent: JSON.stringify(userParamsConfig)
      }
      postSetuserparamtersettings(params).then(res => {
        if (res && res.code === 10000) {
          this.$message.success(res.message || '设置用户配置参数成功！')
          this.dialogVisible = false
          // if (this.hospitalCode === this.$store.state.user.hospitalCode) {
          //   this.$store.dispatch('settings/getAppConfigSetting')
          // }
          window.location.reload()
        } else {
          this.$message.warning(res.message)
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.config_container{
  display: inline-block;
  .setting_btn{
    padding: 2px;
    color: #666;
    font-size: 20px;
    cursor: pointer;
    &:hover{
      color: #00C0EF
    }
  }
}
.config_setting_dialog{
  /deep/ .el-dialog__body{
    padding: 5px 20px;
    max-height: calc(100vh - 220px);
    overflow-y: auto;
  }
}
/deep/ .sortable-drag {
  background: #C7F2F9;
}
</style>
